<template>
	<view class="body">		
		<view class="search-box" v-if="this.SALESND_ID==''">
			<input type="text" placeholder="请输入或扫描发货单" class="search-input" v-model="code" @confirm="doByInput" confirm-type="search"/>
			<view class="search-btn" @tap="doByInput">
				<image src="../../static/icons/icon_search2.png" class="btn-icon"></image>
			</view>
			<!-- /btn-group -->
		</view>
		<!-- <view class="menu-wrapper" v-if="this.SALESND_ID==''">
			<input type="text" placeholder="请输入或扫描发货单" class="input" :value="code" @confirm="doByInput" confirm-type="search"/>			
		</view> -->
		<view class="menu-wrapper" v-if="this.SALESND_ID!=''">
			<view class="btn-wrapper">
				<button type="primary" @tap="change" >重新扫描其他单据</button>
				<!-- class="flexbtn-change" -->
				<!-- <button type="default" @tap="reDoInput" class="flexbtn-refresh">刷新</button> -->
			</view>			
		</view>
		<view class="divider" v-if="this.SALESND_ID==''">
			
		</view>
		<!-- <view v-for="(item,i) in listData" :class=" [item.times==item.scanned?'item-container':'item-container red']">
			<view class="menu-wrapper">
				产品编号:{{item.part_id}}
			</view>
			<view class="menu-wrapper">
				产品条码:{{item.saleord_ord}}
			</view>
			<view class="menu-wrapper">
				AMT:{{item.salesnd_amnt}}
			</view>
			<view class="menu-wrapper">
				BOX:{{item.boxs}}
			</view>
			<view class="menu-wrapper">
				应扫次数:{{item.times}}/扫描次数:{{item.scanned}}
			</view>
		</view> -->
		<v-table :columns="columns" :list="listData" :showIndex="true" selection="single" @on-selection-change="onSelectionChange" :row-class-name="rowClassNameFn"></v-table>	
		<view class="menu-wrapper" v-if="listData.length>0">
			合计：{{amt_hj}} 应扫合计：{{ys_hj}} 扫描合计:{{sm_hj}}
		</view>
		<uni-drawer ref="showRight" mode="right" :mask-click="false">
			<view class="scroll-view">
				<scroll-view class="body" scroll-y="true" >
					<view class="menu-wrapper">
						<view class="btn-wrapper">
							<button type="default" @tap="closeDrawer('showRight')">关闭</button>
						</view>			
					</view>
					<view class="info-content">
						<v-table :columns="itemcolumns" :list="itemData"></v-table>
					</view>
				</scroll-view>
			</view>
		</uni-drawer>
	</view>
</template>

<script>
	import SCan from 'common/scan.js'
	import vTable from '../../components/tablewithindex.vue'
	import uniDrawer from '../../components/uni-drawer/uni-drawer.vue'
	
	 
	export default {
		components:{
			vTable,
			uniDrawer
		},
		data() {
			return {
				code:'',
				PART_ID:'',
				SALESND_ID:'',
				SALEORD_ORD:'',
				SALESND_AMNT:'',
				BOXS:'',
				TIMES:'',
				SCANNED:'',
				amt_hj:0,
				ys_hj:0,
				sm_hj:0,
				listData:[],
				itemData:[],
				columns: [
					{
						title: '产品编号',
						key: 'part_id',
						$fixed:"left",
						$checked:true
					},
					{
						title: '订单号',
						key: 'saleord_ord',
						$fixed:"left"
					},
					{
						title: 'BOX',
						key: 'boxs',
						$width:"60px"
					},
					{
						title: 'AMT',
						key: 'salesnd_amnt',
						$width:"60px"
					},
					{
						title: '应扫次数',
						key: 'times'
					},
					{
						title: '扫描次数',
						key: 'scanned'
					}
				],
				itemcolumns:[
					{
						title: 'BOX',
						key: 'part_packseq'
					},
					{
						title: '扫描次数',
						key: 'scaned'
					}
				]
			}
		}, 
		onShow: function(){
		    SCan.initScan(this.queryAndScan) 
		    SCan.startScan();  
		},  
		onHide:function(){  
		    SCan.stopScan();  
		},  
		onUnload:function(){
		    SCan.stopScan();
		}, 
		onPullDownRefresh:function(){
			console.log(1);
			this.reDoInput();
			 uni.stopPullDownRefresh()//关闭下拉刷新  
		},
		methods: {
			rowClassNameFn(row,index){
				// console.log(row);
				if(row.times!=row.scanned){
					return 'bgRed';
				}
			},
			closeDrawer() {
				this.$refs['showRight'].close()
			},
			onSelectionChange(obj){
				var _this=this;
				var param={
					id:obj.new.item.salesnd_id,
					id2:obj.new.item.part_id
				}
				// console.log(param)
				_this.$http.exbox(param).then(res=>{
					if(res.code=='1'){
						var array=res.data;
						if(array.length>0){
							_this.itemData=array;
							// console.log(array);
							this.$refs['showRight'].open()
						}
						else{
							// uni.showToast()
							uni.showToast({
								title:_this.$config.msgs.nodata,
								icon:'none',
								duration:1500
							})
						}
					}
				})
				// console.log(obj)
			},
			reDoInput(){
				var codetmp=this.SALESND_ID
				this.SALESND_ID=''
				this.queryAndScan(codetmp);
				this.SALESND_ID=codetmp
			},
			change(){
				this.SALESND_ID=''
				this.code=''
				this.listData=[]
				uni.setNavigationBarTitle({
					title:'出库扫描'
				})
			},
			doByInput(e){
				var _this=this;
				_this.queryAndScan(_this.code)
			},
			queryAndScan(code){
				var _this=this;
				_this.code=code;
				if(_this.code!=""){	
					//判定此用户是否具有当前货位权限
					var date=new Date();
					_this.$config.SysConfig.TODAY_SCAN.push({
						page:'出库',
						code:code,
						date:date.getHours()+':'+date.getMinutes()+":" +date.getSeconds()
					})
					
					if(_this.$config.SysConfig.APP_ISONLINE){		
						//在线
						_this.$common.isWifiExec(()=>{
							// console.log(_this.SALESND_ID)
							if(_this.SALESND_ID!=''){
								uni.showLoading({
									title: '条码验证...'
								});
								//出库
								var param={
									barcode:_this.code.replace(/[\r\n]/g,""),
									salesendid:_this.SALESND_ID,
									userid:_this.$config.SysConfig.loginedUser.loginname
								}
								_this.$http.ex(param).then(res=>{									
									uni.hideLoading()
									if(res.code=='1'){
										uni.showToast({
											icon:'none',
											title:res.msg,
											duration:1500
										})
									}
									else{
										_this.$common.playErrBeep(1);
										SCan.stopScan();
										uni.showModal({
											showCancel:false,
											title:'提醒',
											content:res.msg,
											success: (res) => {
												if(res.confirm){
													SCan.startScan();
												}
											}
										})
									}
								})
							}
							else{								
								uni.showLoading({
									title: '数据读取中...'
								});
								//出库单不存在先扫出库单
								var param={
									barcode:_this.code.replace(/[\r\n]/g,"")
								}
								_this.$http.salesend(param).then(res=>{
									uni.hideLoading()
									if(res.code=='1'){			
										var array=res.data;
										if(array.length>0){
											this.listData=array
											// console.log(array)
											for(var i=0;i<array.length;i++){
												_this.amt_hj+=parseInt(array[i].salesnd_amnt);
												_this.ys_hj+=parseInt(array[i].times);
												_this.sm_hj+=parseInt(array[i].scanned);
											}
											_this.PART_ID =array[0].part_id
											_this.SALESND_ID =array[0].salesnd_id
											_this.SALEORD_ORD =array[0].saleord_ord
											_this.SALESND_AMNT =array[0].salesnd_amnt
											_this.BOXS =array[0].boxs
											_this.TIMES =array[0].times
											_this.SCANNED =array[0].scanned
											if(_this.SALESND_ID!=''){											
												uni.setNavigationBarTitle({
													title:'出库扫描'+'--'+_this.SALESND_ID
												})
											}
										}
										else{
											uni.showToast({
												title:_this.$config.msgs.nodata,
												icon:'none',
												duration:1500
											})
											// _this.$common.playErrBeep(1);
										}
									}
									else{										
										_this.$common.playErrBeep(1);
										SCan.stopScan();
										uni.showModal({
											title:'提醒',
											content:res.msg,
											showCancel:false,
											success: (resp) => {
												if(resp.confirm){
													SCan.startScan();
												}
											}
										})
									}
								})
							}							
						},()=>{
							// _this.$common.playErrBeep(1);
							// uni.showToast(_this.$config.msgs.needwifi)
							uni.showToast({
								title:_this.$config.msgs.needwifi,
								icon:'none',
								duration:1500
							})
						})
					}
					else
					{ //离线 无法查询
						// _this.$common.playErrBeep(1);
						// uni.showToast(_this.$config.msgs.needonline)
						uni.showToast({
							title:_this.$config.msgs.needonline,
							icon:'none',
							duration:1500
						})
					}
				}
				else {
					// _this.$common.playErrBeep(1);
					console.log('err')
				}
			}
		}
	}
</script>

<style>
.body{
	border-top: solid 1px #DBDBDA;
	padding: 0 5upx;
}
.input{
	width: 100%;
	height: 85upx;
	padding-right: 80upx;
	background: url('../../static/icons/qrcode.png') no-repeat scroll right center transparent;
}
.menu-wrapper{
	flex-direction: row;
	display: flex;
	padding:0 40upx;
}
/* .divider{
	border-bottom: solid 4upx #ADADAD;
	height: 1upx;
	margin: 10upx 0upx;
} */
.menu-wrapper .btn-wrapper{
	padding: 10upx 5upx 10upx 5upx;
	width: 100%;
}
.item-container{
	padding: 5upx 15upx 15upx 15upx;	
	background-color: #f4f4f4;
	color: #444;
	border-color: #ddd;
	margin-top: 10upx;
	border-radius: 10upx;
}
.item-container.red{
	padding: 5upx 15upx 15upx 15upx;	
	background-color: #BD362F;
	color:#FFFFFF;
	border-color: #a9302a;
	border-radius: 10upx;
	margin-top: 10upx;
}
.info-content{
	padding: 10upx 15upx;
}
.flexed{
	display: flex;
	flex-direction: row;
	justify-content: center;
	
}
.flexbtn-change{
	flex-grow: 3;
}
.flexbtn-refresh{
	flex-grow: 1;
	margin-left: 15upx;
}
.search-box {
    display: flex;
	flex-direction: row;
	padding: 0upx 15upx;
}
.search-input {
   flex-grow: 11;
   height: 75upx;
   line-height: 80upx;
}
.search-btn {
    flex: 1;
	border: none;	
	padding: 10upx 10upx 5upx 10upx;
}
.btn-icon{
	width: 60upx;
	height: 60upx;
	line-height: 80upx;
}
.divider{
	border-top: solid 4upx #ADADAD;
	height: 1upx;
}
.bgRed{
	color: #FF0000;	
}
</style>
